<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>GMAT :: Create Group</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<!--[if IE 7]>
<style type="text/css">
	/* style only IE 7 */
    #search-gmat input.text {
    	padding-top:5px;
        height:21px;
        float:left;
        display:block;
    }
    #cols3-container div.left-menu li {height:24px;}
</style>
<![endif]-->
<!--[if IE 8]>
<style type="text/css">
	/* style only IE 8 */
    #search-gmat input.text {
    	padding-top:5px;
        height:21px;
        display:block;
    }
    ul.top-menu li {float:left; padding:11px 19px 4px 19px;}
    div.comment-sub img.space {height:1px; width:24px;}
</style>
<![endif]-->
<!--[if IE 9]>
<style type="text/css">
	/* style only IE 9 */
    ul.top-menu li {float:left; padding:11px 19px 4px 19px;}
    
    ul.top-menu li.home, ul.top-menu li.home-selected, ul.top-menu li.home:hover {width:40px;}
    ul.top-menu li.profile, ul.top-menu li.profile-selected, ul.top-menu li.profile:hover {width:46px;}
    ul.top-menu li.test, ul.top-menu li.test-selected, ul.top-menu li.test:hover {width:29px;}
    ul.top-menu li.tools, ul.top-menu li.tool-selecteds, ul.top-menu li.tools:hover {width:37px;}
    ul.top-menu li.group, ul.top-menu li.group-selected, ul.top-menu li.group:hover {width:44px;}
    ul.top-menu li.forums, ul.top-menu li.forums-selected, ul.top-menu li.forums:hover {width:53px;}
    ul.top-menu li.blog, ul.top-menu li.blog-selected, ul.top-menu li.blog:hover {width:32px;}
</style>
<![endif]-->
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
	$(function() {
		$("#account").click(function() {
			if($(this).attr("class") == "account") {
				$("#account-sub").show();
				$(this).removeClass("account").addClass("account-selected");
			} else {
				$(this).removeClass("account-selected").addClass("account");
				$("#account-sub").hide();
			}
		});
	});

$(document).ready(function(){
	$('#tabs div').hide();
	//$('#tabs div:first').show();
	//$('#tabs ul li:first').addClass('active');
	$('#tabs div:eq(1)').show();
	$('#tabs ul li:eq(1)').addClass('active');
	$('#tabs ul li a').click(function(){ 
		$('#tabs ul li').removeClass('active');
		$(this).parent().addClass('active'); 
		var currentTab = $(this).attr('href'); 
		$('#tabs div').hide();
		$(currentTab).show();
		return false;
	});
});
</script>
</head>

<body class="cols3">
<div class="cols3-head">
	<div id="header-gmat">
    	<div class="col207">
        	<div id="logo-gmat">
                <a href=""><img src="images/logo.png" width="129" height="48" alt="GMAT" /></a>
            </div>
        </div>
        <div class="col328">
        	<div id="search-gmat">
                <form name="search" id="search" method="post" action="" onsubmit="">
                	<ul class="frm">
                        <li class="q">
                            <input type="text" class="text" name="q" id="q" value="Search" />
                        </li>
                        <li class="search">
                            <input type="submit" class="btn" value="" />
                        </li>
                    </ul>
                </form>
                <div class="clr"></div>
            </div>
        </div>
        <div class="col258">
        	<div id="user-gmat">
            	<ul>
                    <li class="has-sub">
                    	<a id="account" href="#" class="account">Account</a>
                        <ul id="account-sub" class="sub" style="display:none;">
                        	<li><a href="">Account</a></li>
                            <li><a href="">Upgrade account</a></li>
                            <li><a href="" class="last">Sign out</a></li>
                        </ul>
                    </li>
                    <li><a href="" class="home">PracticeMekesPerfect</a></li>
                </ul>
            </div>
        </div>
        <div class="clr"></div>
        <div class="col1090">
        	<ul class="top-menu">
            	<li class="home"><a href="">Home</a></li>
                <li class="profile"><a href="">Profile</a></li>
                <li class="test"><a href="">Test</a></li>
                <li class="tools"><a href="">Tools</a></li>
                <li class="group-selected"><a href="">Group</a></li>
                <li class="forums"><a href="">Forums</a></li>
                <li class="blog"><a href="">Blog</a></li>
            </ul>
        </div>
    </div>
    <!-- end header -->
</div>
<div id="cols3-container">
	<div id="cols3-inner">
    	<div id="cols3-left">
        	<div class="col207">
                <div id="left-gmat">
                    <div class="inner">
                        <div class="user-info solid">
                            <a href="">
                                <img src="images/avatar.jpg" alt="" />
                                <span>Nghiêm Anh Tuấn</span>
                            </a>
                            <div class="clr"></div>
                        </div>
                        <div class="left-menu solid">
                            <ul>
                                <li class="selected">
                                    <a href="">
                                    	<span class="account">Account</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                    	<span class="notifications">Notifications</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                    	<span class="label">Label</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                    	<span class="upgrade_account">Upgrade Account</span>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- end cols 3 left -->
        <div id="cols3-right">
        	<div class="col200">
                <div id="right-gmat">
                    <div class="ga">
                        google adsense
                    </div>
                    <div class="popular">
                        <h2>Popular search</h2>
                        <div class="right-menu">
                            <ul>
                                <li>
                                    1. <a href="">GMAT</a>
                                </li>
                                <li>
                                    2. <a href="">Test IQ</a>
                                </li>
                                <li>
                                    3. <a href="">Vocabulary</a>
                                </li>
                                <li>
                                    4. <a href="">Performance</a>
                                </li>
                                <li>
                                    5. <a href="">Problem Solving</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- end cols 3 right -->
        <div id="cols3-center">
            <div id="center-gmat">
                <div class="new-group">
                    <h1>Group name</h1>
                    <form name="manage_group" id="manage-group" method="post" onsubmit="" action="">
                        <div id="tabs">
                            <ul>
                                <li><a href="#general-infomation">General infomation</a></li>
                                <li><a href="#change-password">Change password</a></li>
                            </ul>
                            <div id="general-infomation" class="content">
                                <table width="100%" cellspacing="15" cellpadding="0" border="0" class="tbl-new-group">
                                    <tr valign="top">
                                        <td class="label">
                                            Name
                                        </td>
                                        <td class="input">
                                            <input type="text" name="account_name" id="account-name" value="" class="text">
                                        </td>
                                        <td>&nbsp;</td>
                                    </tr>
                                    <tr valign="top">
                                        <td class="label">
                                            Email
                                        </td>
                                        <td class="input">
	                                        <input type="text" name="account_email" id="account-email" value="" class="text">
                                        </td>
                                        <td>&nbsp;</td>
                                    </tr>
                                    <tr valign="top">
                                        <td class="label">
                                            Avatar
                                        </td>
                                        <td class="input">
	                                        <img alt="" src="images/avatar.jpg">
                                            <a href="">Change</a>
                                        </td>
                                        <td>&nbsp;</td>
                                    </tr>
                                    <tr valign="top">
                                        <td class="label">&nbsp;</td>
                                        <td>
                                            <input type="submit" class="btn" value="">
                                        </td>
                                        <td>&nbsp;</td>
                                    </tr>
                                </table>
                            </div>
                            <div id="change-password" class="content">
                                <table width="100%" cellspacing="15" cellpadding="0" border="0" class="tbl-new-group">
                                    <tr valign="top">
                                        <td class="label">
                                            Old password
                                        </td>
                                        <td class="input">
                                            <input type="password" name="old_password" id="old-password" value="" class="text">
                                        </td>
                                        <td>&nbsp;</td>
                                    </tr>
                                    <tr valign="top">
                                        <td class="label">
                                            New password
                                        </td>
                                        <td class="input">
                                            <input type="password" name="new_password" id="new-password" value="" class="text">
                                        </td>
                                        <td>&nbsp;</td>
                                    </tr>
                                    <tr valign="top">
                                        <td class="label">
                                            Confirm password
                                        </td>
                                        <td class="input">
                                            <input type="password" name="confirm_password" id="confirm-password" value="" class="text">
                                        </td>
                                        <td>&nbsp;</td>
                                    </tr>
                                    <tr valign="top">
                                        <td class="label">&nbsp;</td>
                                        <td>
                                            <input type="submit" class="btn" value="">
                                        </td>
                                        <td>&nbsp;</td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                        <div class="manage-group-b"></div>
                        <div class="clr"></div>
                    </form>
                </div>
            </div>
        </div>
        <div class="clr"></div>
    </div>
</div>
<div class="cols3-foot">
	<!-- footer -->
    <div id="footer-gmat">
    	<div class="inner">
            <ul>
                <li class="fl">
                    PracticeMakesPerfect @ 2011-2012
                </li>
                <li class="fr">
                    <a href="">Contact Us</a> | 
                    <a href="">Term of Service</a> | 
                    <a href="">Privacy</a>
                </li>
            </ul>
        </div>
    </div>
</div>
</body>
</html>
